Page({
  timer: null,
  data: {
    editId: 0,
    isAdd: true,
    inputValue: '',
    title: '',
    showModal: false,
    searchValue: '',
    showList: [],
    list: [],
  },
  onLoad() {
    const storageData = wx.getStorageSync('toDoList');
    if(!!storageData) return;
    const list = [
      {
        id: 0,
        content: '吃饭',
        isFinished: true,
      },
      {
        id: 1,
        content: '洗澡',
        isFinished: false,
      },
      {
        id: 2,
        content: '睡觉',
        isFinished: false,
      },
      {
        id: 3,
        content: '工作',
        isFinished: false,
      }
    ]
    wx.setStorageSync('toDoList', list);
  },
  onShow() {
    const showList = wx.getStorageSync('toDoList') || [];
    this.setData({
      showList,
    });
  },
  handleSearchValueChange(e) {
    this.setData({
      searchValue: e.detail.detail.value,
    });
    if (this.timer) {
      clearTimeout(this.timer);
      this.timer = null;
    }
    this.timer = setTimeout(this.updateShowList.bind(this), 500);
  },
  handleCheckboxChange(e) {
    const { id: changeId } = e.currentTarget.dataset;
    const list = wx.getStorageSync('toDoList') || [];
    const changeIndex = list.findIndex((item) => item.id === changeId);
    if (changeIndex === -1) return;
    list[changeIndex].isFinished = !list[changeIndex].isFinished;
    wx.setStorageSync('toDoList', list);
    this.updateShowList();
  },
  handleDeleteItem(e) {
    const { id: changeId } = e.currentTarget.dataset;
    const list = wx.getStorageSync('toDoList') || [];
    const listChangeIndex = list.findIndex((item) => item.id === changeId);
    if (listChangeIndex === -1) return;
    list.splice(listChangeIndex, 1);
    wx.setStorageSync('toDoList', list);
    this.updateShowList()
  },
  updateShowList() {
    const { searchValue } = this.data;
    const list = wx.getStorageSync('toDoList') || [];
    const filterList = list.filter((item) =>
      item.content.includes(searchValue)
    );
    this.setData({
      showList: filterList,
    });
  },

  handleInputChange(e) {
    this.setData({
      inputValue: e.detail.value
    })
  },
  handleAdd() {
    this.setData({
      isAdd: true,
      showModal: true
    })
  },
  handleEdit(e) {
    const { id: editId } = e.currentTarget.dataset;
    const list = wx.getStorageSync('toDoList') || [];
    const { content = '' } = list.find((item) => item.id === editId);
    this.setData({
      isAdd: false,
      showModal: true,
      inputValue: content,
      editId
    })
  },
  handleCancel() {
    this.setData({
      inputValue: '',
      showModal: false,
    });
  },
  handleConfirm() {
    const { inputValue, isAdd, editId } = this.data;
    const list = wx.getStorageSync('toDoList') || [];
    if (inputValue === '') {
      wx.showToast({
        title: '输入内容不能为空！',
        icon: 'none',
        mask: true,
      });
      return;
    }
    if(isAdd) {
      list.push({
        id: new Date().getTime(),
        content: inputValue,
        isFinished: false,
      });
    } else {
      const editItem = list.find((item) => item.id === editId);
      editItem.content = inputValue;
    }
    wx.setStorageSync('toDoList', list);
    this.setData({
      inputValue: '',
      showModal: false
    }, this.updateShowList);
  },
});
